<div class=" admin-content">
<div class="admin-biaogelist">
	
    <div class="listbiaoti am-cf">
      <ul class="am-icon-flag on"> 栏目管理</ul>
      
      <dl class="am-icon-home" style="float: right;"> 当前位置： <a href="{:U('Index/index')}">首页</a> > 栏目管理</dl>
      
      <dl>
        <a href="{:U('add')}" class="am-btn am-btn-danger am-round am-btn-xs am-icon-plus"> 添加一级栏目</a>
      </dl>
    </div>
    <form class="am-form am-g">
          <table width="100%" class="am-table am-table-bordered am-table-radius am-table-striped">
            <thead>
              <tr class="am-success">
                <th class="table-id">id</th>
                <th class="table-id">排序</th>
                <th class="table-type">栏目名称</th>
                <th class="table-type">栏目类型</th>
                <th class="table-type">英文标识</th>
                <th width="163px" class="table-set">操作</th>
              </tr>
            </thead>
            <tbody>
            <volist name="data" id="vo">
              <tr class="cate" level="{$vo.level}">
                <td>{$vo.id}</td>
                <td>{$vo.sort}</td>
                <td><if condition="$vo['level'] neq 0">└</if>{:str_repeat('─',2*$vo['level'])}<span class="contro" style="display: inline-block;border: 1px solid #000;line-height: 5px;height: 11px;width: 12px;text-align: center;cursor: pointer;">+</span>{$vo.name}</td>
                <td>{$vo.type}</td>
                <td>{$vo.en_name}</td>
                <td>
                  <div class="am-btn-toolbar">
                    <a href="{:U('add',array('id'=>$vo['id']))}">添加子目录</a>
                    <a href="{:U('edit',array('id'=>$vo['id']))}">编辑</a>
                    <a href="javascript:void(0);" onclick="del({$vo['id']})">删除</a>
                  </div>
                </td>
              </tr>
              </volist>
              
            </tbody>
          </table>
        </form>
<script>
function del(id){
    if(!confirm('确定要删除吗？')){
      return false;
    }
    $.ajax({
      url : "{:U('del')}",
      data : {'id':id},
      type : 'post',
      dataType : 'json',
      success : function(res){
        if(res.status == 'OK'){
          alert(res.msg);
          location = "__SELF__";
        }
        else if(res.status == 'NO'){
          alert(res.msg);
        }
      }
    });
  }

  //子栏目现实隐藏
  var tr = $('.cate');
  var span = $('.contro');
  tr.each(function(i){
    //如果不是一级栏目就隐藏
    if($(this).attr('level') != 0){
      $(this).hide();
    }
    //如果没有子栏目，就不显示展开按钮
    if($(this).next().attr('level') <= $(this).attr('level') || $(this).next().attr('level') == null){
      $(this).find('span').hide();
    }
  })

  span.on('click',function(){
    var level = $(this).parents('tr').attr('level');
    var child_tr = $(this).parents('tr').nextAll();
    if($(this).html() == "+"){
      $(this).html('-');
      level++;
      child_tr.each(function(i){
        if($(this).attr('level') < level){
          return false;
        }
        if($(this).attr('level')  == level){
          $(this).show();
        }
      });
    }
    else{
      $(this).html('+');
      child_tr.each(function(i){
        if($(this).attr('level') <= level){
          return false;
        }
        $(this).hide();
        $(this).find('span').html('+');
      });
    }
  })
</script>